<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.aa{
				height: 400px;
				border: 1px solid black;
			}
		</style>
	</head>
	<body>
		<div id="test">
			<a href="javascript:history.go(-1)">返回上一页</a> 
			<a href="javascript:location.reload()">刷新当前页面</a> 
			<a href="javascript:" onclick="history.go(-2); ">返回前两页</a> 
			<a href="javascript:" onclick="self.location=document.referrer;">返回上一页并刷新</a> 
			<a href="javascript:" onclick="history.back(); ">返回上一页</a> 
			<div class="aa"></div>
			<div class="aa"></div>
			<div class="aa"></div>
			<div class="aa"></div>
			
		</div>
		<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
		<script src="vue.min.js"></script>
		<script type="text/javascript">
			new Vue({
				el:'#test',
				data:{
					scroll:''
				},
				mounted:function(){
					//滚动到指定位置
					window.scroll(0, 100) 
					//滚动距离
					window.scrollBy(0,200)				
					//监听窗口滚动
					window.addEventListener('scroll', this.handleScroll);					
					//窗口大小改变
					window.addEventListener('resize', this.resize);
					//返回最顶层的先辈窗口,修改地址栏
//					window.top.location.href = 'http://www.baidu.com'
					console.log(window.top.location.href)
				},
				methods:{
					handleScroll:function(){
						 this.scroll = document.body.scrollTop							
					},
					resize:function(){
						console.log( window.screen.width + ',' + window.screen.height)
					}
				},
				watch:{
					scroll:function(val){
						console.log(val)
					}					
				}
			})
		</script>
	</body>
</html>
